<%--
  Created by IntelliJ IDEA.
  User: Colorful
  Date: 2023/8/10
  Time: 11:52
  To change this template use File | Settings | File Templates.
--%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="path" value="${pageContext.request.contextPath }"/>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<head>
    <title>我的订单</title>
    <script rel="script" src="${path}/js/jquery-3.6.4.js"></script>
    <link rel="stylesheet" type="text/css" href="${path}/css/userOrderDetail.css">
</head>
<body>
<c:set var="ordersList" value="${requestScope.ordersList}"/>
<div class="orders-container">
    <div class="profile-title">
        我的订单
    </div>
    <div class="order-box">
        <c:set var="user_id" value="${sessionScope.user.user_id}"/>
        <c:choose>
            <c:when test="${empty ordersList}">
                <script>
                    window.location='${path}/OrderUserServlet?prom=orderUser&id=${user_id}';
                </script>
            </c:when>
            <%--<c:when test="${empty ordersList}">
                <h1>暂无订单</h1>
            </c:when>--%>
            <c:otherwise>
                <c:forEach var="ol" items="${ordersList}">
                    <div id="${ol.orders_id}">
                        <div class="order-header">
                            <span class="order-date">${ol.orders_time}</span>
                            <span class="order-id">猫眼订单号：2416203867${ol.orders_id}</span>
                            <span class="del-order" onclick="delOrder(${ol.orders_id})"></span>
                        </div>
                        <div class="order-body">
                            <div class="poster"><img src="${path}/images/moviePicture/${ol.movie_picture}"></div>
                            <div class="order-content">
                                <div class="movie-name">《${ol.movie_cn_name}》</div>
                                <div class="cinema-name">${ol.cinema_name}</div>
                                <div class="hall-ticket">${ol.seat}</div>
                                <div class="show-time">${ol.orders_time}</div>
                            </div>
                            <div class="order-price">￥${ol.orders_price}</div>
                            <div class="order-status">
                                <c:if test="${ol.orders_status==1}">
                                    已完成
                                </c:if>
                                <c:if test="${ol.orders_status==2}">
                                    已取消
                                </c:if>
                                <c:if test="${ol.orders_status==3}">
                                    待支付
                                </c:if>
                                <c:if test="${ol.orders_status==4}">
                                    待取票
                                </c:if>
                            </div>
                            <div class="actions">
                                <div>
                                    <a class="order-detail" onclick="detail(${ol.orders_id})">查看详情</a>
                                </div>
                            </div>
                        </div >
                    </div>
                </c:forEach>
            </c:otherwise>
        </c:choose>
        <c:set var="pages" value="${sessionScope.page}"/>
        <div style="text-align: center;width: 878px;">
            <p style="display: inline-block">当前页数：[${pages.currPageNo}/${pages.totalPageCount}]
                <c:if test="${pages.currPageNo>1}">
            <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=1&id=${user_id}">
                <input type="submit" value="首页" class="n1">
            </form>
            <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.currPageNo-1}&id=${user_id}">
                <input type="submit" value="上一页" class="n1" >
            </form>
            </c:if>
            <c:if test="${pages.currPageNo<pages.totalPageCount}">
                <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.currPageNo+1}&id=${user_id}">
                    <input type="submit" value="下一页" class="n1">
                </form>
                <form style="display: inline-block" method="post" action="${path}/OrderUserServlet?prom=orderUser&pageIndex=${pages.totalPageCount}&id=${user_id}">
                    <input type="submit" value="末页" class="n1">
                </form>
            </c:if>
            </p>
    </div>
</div>
<script>
    function delOrder(orderId) {
        var str=confirm("您确定要删除该订单嘛？删除后，不可恢复～");
        if (str){
            $.post("${path}/OrderUserServlet?prom=userDelOrder","&id="+orderId,function (result) {
                if (result>0){
                    alert("删除成功！");
                    $("#"+orderId).remove();
                }else {
                    alert("删除失败")
                }
            },"text");
        }
    }
    function detail(orderId) {
        window.location='${path}/OrderUserServlet?prom=orderDetail&id='+orderId;
    }
</script>
</body>
</html>
